<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>03_元素属性操作</title>
		<!-- 元素属性操作：针对元素种属性
		 元素：固定属性 attr（） removeAttr（） 针对元素自带属性，捆绑型
		       附加属性   prop（）removeProp（） 针对表单元素，附加型
			   特点：固定属性和附加属性【两对函数使用方式一致】
			   prop（）          功能：表单元素：input元素，添加获取属性值的方法
			                    有参：传一个值
								功能：表单元素中附加属性【checked，disabled】
								添加bool布尔值，获取input元素布尔值[是否选中状态]
                                语法：prop（“属性”）
									传2个值
								语法：prop（“属性”，“属性值：bool”）
								功能：设置input元素中属性状态【true设置选中，false未选中】
				removeProp（）				
			   -->
			   <script src="../js/jquery-1.11.1.js"></script>
	</head>
	<body>
		<h1>prop()函数与removeProp()函数使用</h1>
		<!-- 复选框  id=“myCheckbox”，checked选中
		 -->
		 学生<input type="checkbox" id="myCheckbox" checked/>
		 <button id="getProBtn">获取属性</button>
		 <button id="setProBtn">设置属性</button>
		 <button id="removeProBtn">移除属性</button>
		 <div id="output"></div>
		 <script>
			 //3.移除属性值---实现多选勾掉
			 $("#removeProBtn").click(function(){
			 	 $("#myCheckbox").removeProp("checked");
			 	 $("#output").text("input元素的check属性已移除");
			 });
			 //2.设置属性值---实现多选狗叼
			 $("#setProBtn").click(function(){
			 	 $("#myCheckbox").prop("checked",false);
			 	 $("#output").text("你获取的checked值是:false");
			 });
			 //1.获取属性值---点击getProBtn--获取input元素中的checked值【布尔型】
			 //                             output提示：你获取的checked值是+变量
			 $("#getProBtn").click(function(){
				 var mcb=$("#myCheckbox").prop("checked");
				 $("#output").text("你获取的checked值是:"+mcb);
			 });
			 
		 </script>
	</body>
</html>